<?php 
	require('auth.php');
	
	
	$badBrowser = false;
	if (stripos($_SERVER['HTTP_USER_AGENT'], 'MSIE')!==FALSE) $badBrowser = "Microsoft Internet Explorer";
	if (stripos($_SERVER['HTTP_USER_AGENT'], 'Opera')!==FALSE) $badBrowser = "Opera Browser";
	if (isset($_GET['debug'])) $badBrowser = false;
?>
<html>
<head>
	<Title>Musiker</title>
	<style type="text/css" media="screen">
		body {
			overflow:hidden;
			margin:0;
			padding:0;
			background-color:silver;
			cursor:default;
			font-family:"Lucida Grande", "Lucida Sans Unicode", Sans-Serif;
		}
		.backdrop {
			position:absolute;
			top: 35%;
			bottom:65%;
			width:100%;
			text-align:center;
			color:maroon;
			font-size:48pt;
			font-family:sans-serif;
			height:135px;
		}
		.backdrop SUB {
			position:relative;
			font-size:170%;
			color:gray;
			right:0;
			bottom:50%;
			top:10px;
			font-family:serif;

		}
		
		.loadProgressFrame {
			position:absolute;
			bottom:0;height:10px;
			left:35%; right:35%;
			border:1px solid gray;
			display:inline;
			background-color:white;
			padding:0;
		}
		.loadProgressFill {
			position:absolute;
			left:0;top:0;
			height:100%;
			width:0;
			background-color:#4673D6;
			background-image:url("images/sidebarSelectBackdrop.gif");
		}
		.loginFrame {
			width:160px;
			top:100%;
			margin-left:auto;
			margin-right:auto;
			padding:10px;
			padding-top:8px;
			border:1px solid gray;
			background:none;
			font-size:8pt;
			font-family: "Lucida Grande", sans-serif;
			color:gray;
			text-align:left;
		}
		.loginFrame INPUT {
			width:100%;
			border:1px solid gray;
			padding:2px;
		}
		.loginFrame P {
			text-align:center;
			font-weight:bold;
			color:red;
		}
		.errorFrame {
			top:100%;
			margin-left:auto;
			margin-right:auto;
			padding:10px;
			padding-top:8px;
			background:none;
			font-size:9pt;
			font-family: "Lucida Grande", sans-serif;
			font-weight:bold;
			color:black;
			text-align:center;
		}
	</style>
	<script type="text/javascript" charset="utf-8">
		//snipped from prototype.js.  shortcut for getElementByID
		function $() {
			var elements = Array();

			for (var i = 0; i < arguments.length; i++) {
				var element = arguments[i];
				if (typeof element == 'string')
				element = document.getElementById(element);

				if (arguments.length == 1) return element;

				elements.push(element);
			}

			return elements;
		}
	</script>
<?php if ($AUTH_LOGINVALID) { //only output js libraries if a valid login is present ?>	
	<LINK href="mainStyles.css.php" rel="stylesheet" type="text/css" />
	<script type="text/javascript" charset="utf-8">
		LoadProgress = {
			totalWeight		:	0,
			currentWeight	:	0,
			weightList		: 	{},
			imgArray		: 	{}, 
			registerModule	: 	function (id, weight) {
				this.weightList[id] = weight;
				this.totalWeight += weight;
			},
			completeModule	: 	function (id) {
				this.currentWeight += this.weightList[id];
				this.update();
			},
			update			: 	function () {
				if (this.currentWeight)
					$('loadProgressFill').style.width = (this.currentWeight/this.totalWeight)*100+"%";
				else if (this.currentWeight >= this.totalWeight)
					$('loadProgressFill').style.width = '100%';
				else 
					$('loadProgressFill').style.width = 0;
			},
			fetchImage		: 	function (imgUrl) {
				LoadProgress.registerModule(imgUrl,2);
				
				var imgLoader = new Image(100,100);
				this.imgArray[imgUrl] = imgLoader;
					imgLoader.onload = function () {LoadProgress.completeModule(this.loadTag);}
					imgLoader.src = imgUrl;
					imgLoader.loadTag = imgUrl;
			}
		}
	</script>
</head>
<body onload="Musiker.Initialize();">
	<div class="backdrop">
		Musiker<sub>2</sub>
		<div class="loadProgressFrame"><div id="loadProgressFill" class="loadProgressFill"></div></div>
	</div>

	<script type="text/javascript" charset="utf-8">
		//register modules for the load progress bar
		//LoadProgress.registerModule('Ajile',5);
		LoadProgress.registerModule('MediaPlayer',5);
		LoadProgress.registerModule('Intrinsic',3);
		LoadProgress.registerModule('MusikerMain',3);
		LoadProgress.registerModule('Artists',10);
		LoadProgress.registerModule('Playlists',2);
		LoadProgress.registerModule('LoadFinished',5);
		
		
		//preload images
		LoadProgress.fetchImage('images/mediumLoadingAnimation.gif');
		LoadProgress.fetchImage('images/largeControlButton_Up.png');
		LoadProgress.fetchImage('images/largeControlButton_Down.png');
		LoadProgress.fetchImage('images/smallControlButton_Up.png');		
		LoadProgress.fetchImage('images/smallControlButton_Down.png');
		LoadProgress.fetchImage('images/sidebarSelectBackdrop.gif');
		LoadProgress.fetchImage('images/searchIcon.gif');		
		LoadProgress.fetchImage('images/playerBackdrop.png');		
		LoadProgress.fetchImage('images/playIcon.png');
		LoadProgress.fetchImage('images/pauseIcon.png');
		LoadProgress.fetchImage('images/backIcon.png');		
		LoadProgress.fetchImage('images/forwardIcon.png');
		LoadProgress.fetchImage('images/itunesPlayIcon.gif');
		LoadProgress.fetchImage('images/playerStatusBackdrop.jpg');		
		LoadProgress.fetchImage('images/sidebarActionBarBackdrop.gif');
		LoadProgress.fetchImage('images/sidebarActionBarButton_disabled.gif');
		LoadProgress.fetchImage('images/sidebarLockIcon.png');		
		LoadProgress.fetchImage('images/sidebarLoadingIcon.gif');		
		LoadProgress.fetchImage('images/iTunesLibrary.png');
		LoadProgress.fetchImage('images/iTunesMusic.png');
		LoadProgress.fetchImage('images/iTunesPartyShuffle.png');		
		LoadProgress.fetchImage('images/iTunesSmartPlaylist.png');		
		LoadProgress.fetchImage('images/iTunesPlaylist.png');	
				
		//next we load all external JS files at once using a php script.
		
		// By doing this I reduce a whole bunch of individual server
		// connections down to one, saving loading time, and it allows
		// me to ensure load order for dependancies.
	</script>
	<?php
		$BulkScriptArray = array(
			//Libraries
			'libs/mediaplayer/swfobject.js',
			'libs/libMediaplayer.js',
			'libs/webtoolkit.base64.js',
			'libs/IntrinsicExtensions.js',
			'libs/libSimpleFetch.js',
			'musiker.js',
			'musiker_mod_player.js',
			
			
			//All modules below can be disabled selectively by commenting their line.
			'musiker_mod_browser.js',
			'musiker_mod_search.js',
			'musiker_mod_nowplaying.js',
			'musiker_mod_hardplaylists.js'
		);
		
		
		
		// Each individual library is put into an array.  This array is then
		// merged into a single URL for a GET request from the php script.
		// url format: BulkData.php?s1=script1.js&s2=script2.js ... $sN=scriptN.js

		echo '<script src="BulkData.php?';
		$i=0;
		foreach($BulkScriptArray as $key => $part) {
			echo "s$i=$part&";
			$i++;
		}
		echo '" type="text/javascript" charset="utf-8"></script>';

?>

	
	<!-- since XMLHttpRequest can't hand a file off to the browser for download, 
		I have to use this for sending POST requests to the M3U generator -->
	<form id="m3u_request" method="post" action="buildM3U.php"><input type="hidden" id="m3u_filelist" name="filelist"></form>







<?php } else { //OUTPUT LOGIN BOX IF NO VALID AUTHENTICATION DATA ?>

</head>
<body>
	<div class="backdrop">
		Musiker<sub>2</sub>
		<?php if ($badBrowser) { //Check for unsupported browsers ?>	
		<div class="errorFrame">
			<p>We apologize, but Musiker does not currently support <?php echo $badBrowser?> (It's on the To-Do list).</p>
			<p>If you would like to use Musiker, please visit the site using one of these supported browsers:<br>
				<a href="http://www.mozilla.com">Mozilla Firefox</a> - 
				<a href="http://www.apple.com/safari">Apple Safari</a> - 
				Konquerer (Linux)</p>

		</div>
		<?php } else { ?>
		<div class="loginFrame">
			<form action="index.php" method="post" accept-charset="utf-8" style="margin:0;">
				Account <br><input type="text" name="login" value="" id="loginField"><br>
				Password <br><input type="password" name="password" value="" id="passField">
				<input type="submit" value="" style="position:absolute; left:-1000; width:10px;">
				<?php if (isset($AUTH_LOGINFAILED)) echo '<p>Login Failed<p>'?>
			</form>
		</div>
		<?php } ?>
	</div>


<?php } ?>
</body>
</html>